blob: d654ff09d5cf30733c027af2aa03c7430c7523fd (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
|
import type { Metadata } from "next";
import Link from "next/link";
import { notFound } from "next/navigation";
import { Eyebrow, Section } from "@/components/section";
import { posts } from "@/lib/content";
type Props = { params: Promise<{ slug: string }> };
export async function generateStaticParams() {
return posts.map((p) => ({ slug: p.slug }));
}
export async function generateMetadata({ params }: Props): Promise<Metadata> {
const { slug } = await params;
const post = posts.find((p) => p.slug === slug);
if (!post) return { title: "Insight" };
return { title: post.title, description: post.dek };
}
export default async function InsightPostPage({ params }: Props) {
const { slug } = await params;
const post = posts.find((p) => p.slug === slug);
if (!post) notFound();
return (
<Section className="pt-16 md:pt-24" innerClassName="max-w-2xl">
<Link
href="/insights"
className="text-sm text-muted-foreground hover:text-primary"
>
← Insights
</Link>
<Eyebrow className="mt-8">
{post.date} · {post.reading}
</Eyebrow>
<h1 className="mt-4 font-heading text-4xl leading-tight md:text-5xl">
{post.title}
</h1>
<p className="mt-4 text-lg leading-relaxed text-muted-foreground">
{post.dek}
</p>
<div className="mt-10 space-y-5 text-[15px] leading-relaxed text-foreground/90">
{post.paragraphs.map((para) => (
<p key={para.slice(0, 40)}>{para}</p>
))}
</div>
<p className="mt-12 text-sm text-muted-foreground">
{post.tags.join(" · ")}
</p>
</Section>
);
}
|
